@media (max-width: 1600px) and (min-width: 1301px){
  .orderList .wrap .item{
    width: calc((100% - 48px) / 4) !important;
    margin-right: 16px !important;
    &:nth-child(4n+4){
      margin-right: 0 !important;
    }
  }
}
@media (max-width: 1300px) and (min-width: 1000px){
  .orderList .wrap .item{
    width: calc((100% - 32px) / 3) !important;
    margin-right: 16px !important;
    &:nth-child(3n+3){
      margin-right: 0 !important;
    }
  }
}
.orderList {
  background: #fff;

  .tabWrap {
    display: flex;
    border-bottom: 1px solid #dcdee2;
    position: relative;
    .loading-bg{
      background: transparent;
      width: calc(100% - 223px);
      height: 100%;
      z-index: 11;
      position: absolute;
      top: 0;
      left: 0;
    }
  }

  .formWrap {
    ::v-deep .ivu-form-item {
      margin-bottom: 0;
    }
  }

  .wrap {
    display: flex;
    flex-wrap: wrap;

    .item {
      width: calc((100% - 64px) / 5);
      margin-top: 15px;
      border-radius: 8px;
      background-color: #fff;
      overflow: hidden;
      position: relative;
      padding: 0 15px;
      line-height: 24px;
      //height: 335px;
      margin-right: 16px;
      .itemBoximg{
        width: 60px;
        height: 60px;
        position: absolute;
        top: 5px;
        right: 5px;
        img{width: 100%;height: 100%;}
      }
      &:nth-child(5n+5){
        margin-right: 0;
      }

      .topR {
        position: absolute;
        right: 10px;
        top: 10px;
        width: 60px;
        height: 50px;

        img {
          width: 100%;
          height: 100%;
          overflow: hidden;
        }
      }
     .tag_item{
       padding: 0 5px;
     }
      .name {
        position: relative;
        height: 40px;
        line-height: 40px;

        span {
          display: inline-block;
          /*height: 40px;*/
          /*line-height: 40px;*/
          padding: 0 3px;

          &:nth-child(1) {
            color: #333;
            font-family: 'MicrosoftYaHei', '微软雅黑', sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 16px;
            /*line-height: 40px;*/
          }

          &:nth-child(2) {
            color: #666;
            font-family: 'MicrosoftYaHei', '微软雅黑', sans-serif;
            font-size: 12px;
            /*line-height: 40px;*/
          }
        }

        .name-img {
          width: 69px;
          height: 26px;
          display: inline-block;
          position: absolute;
          left: 170px;
          top: 0;

          img {
            width: 100%;
            height: 100%;
            overflow: hidden;
          }
        }
      }

      .details {
        //height: 240px;
        //padding-left: 10px;
        background-color: #f8fcff;
        margin: 12px 0;
        position: relative;

        .formItem {
          display: flex;
          align-items: center;

          .label {
            width: 90px;
            font-family: 'MicrosoftYaHei', '微软雅黑', sans-serif;
            font-weight: 400;
            font-style: normal;
            display: flex;
            justify-content: flex-end;
            align-items: center;
            font-size: 12px;
            color: #888888;
            line-height: 30px;
          }

          .value {
            width: calc(100% - 120px);
            color: #333;
            padding: 0 3px;
            font-family: 'MicrosoftYaHei', '微软雅黑', sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 12px;
          }

          .num {
            color: #187bdb;
            text-decoration: underline;
            cursor: pointer;
          }
        }

        .img {
          position: absolute;
          bottom: 0;
          right: 0;
          font-size: 36px;
        }

        .preview {
          position: absolute;
          right: 0;
          bottom: 50px;
          width: 40px;
          height: 40px;
          background: #eee;

          .preview-img {
            width: 40px;
            height: 40px;
            overflow: hidden;
          }
        }
      }

      .ivu-tag-blue {
        border-color: #f1f7fd;
        border-radius: 24px;
        font-family: 'MicrosoftYaHei', '微软雅黑', sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 12px;
        color: #187BDE !important;
      }

      /deep/ .ivu-tag-blue .ivu-tag-text {
        color: #187BDE !important;
        padding: 3px 3px;
      }

      .btnF {
        //line-height: 40px;
        //position: absolute;
        //bottom: 0;
        //right: 0;
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        /deep/ .ivu-checkbox-wrapper{margin: 0 !important; padding-left: 10px;}
        .btnF_box{
          display: flex;
          justify-content: flex-end;
          align-items: center;
        }
        .btn{
          //width: 88px;
          //height: 32px;
          margin-left: 5px;
          display: flex;
          justify-content: center;
          align-items: center;
          //border-radius: 25px;
          font-size: 14px;
          font-weight: 400;
        }
        .delbtn{color: #ed4014 !important; border: 1px solid #ed4014 !important;}
        .btn{color: #035BEB; border: 1px solid #035BEB;}
        .checkbtn{color: #00142D;border: 1px solid rgba(0,20,45,0.5000);}
        //button {
        //  margin-left: 5px;
        //}
      }
    }
  }

  .title {
    display: flex;
    justify-content: space-between;
    font-size: 20px;
    padding: 10px;
    border-bottom: 1px solid #dddddd;

    .icon {
      display: flex;

      .creatBtnright {
        display: flex;
        align-items: center;
        font-size: 16px;

        i {
          font-size: 36px;
        }
      }
    }
  }
}

.over-wrapper {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

::v-deep .tab {
  background-color: #fff;
  height: 50px;
  padding: 10px 50px;
  flex: 1;

  .ivu-tabs-bar {
    padding-left: 30px;
    border-bottom: none;
  }

  .ivu-tabs-tab {
    height: 50px;
    line-height: 50px;
    padding: 0 16px;

    div {
      font-size: 16px;
    }
  }
}

.unreciver {
  position: relative;
  display: inline-block;
  width: 69px;
  height: 35px;
  margin-right: 10px;
  background: inherit;
  background-color: rgba(242, 242, 242, 1);
  border: none;
  border-radius: 5px;
  font-family: 'Arial Normal', 'Arial', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 13px;
  letter-spacing: normal;
  color: #333333;
  vertical-align: none;
  text-align: center;
  line-height: 35px;
  text-transform: none;

  img {
    position: absolute;
    width: 12px;
    height: 12px;
    top: 23px;
    right: 1px;
  }
}

.tenace_box{
  ::-webkit-scrollbar {
    width: 0;
  }
  ::-webkit-scrollbar {
    display: none;
  }
 .box_content{
   position: relative;
   height: calc(100vh - 150px);
   .van-list{
     .van-cell{
       margin: 10px 0;
       padding: 0 8px;
       background-color: transparent;
     }
   }
   .serachBoxMain{
     background-color: transparent !important;
     margin-top: 300px;
     .listBox{
       margin-bottom: 10px;
       padding-right: 5px;
     }
     .noneList{
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       width: 100%;
       height: 66vh;
       .img_box{
         width: 178px;
         height: 120px;
         margin-bottom: 10px;
         img{width: 100%;height: 100%;}
       }
       .noneListText{
         font-size: 14px;
         font-weight: 400;
         color: rgba(0,20,45,0.5000);
       }
     }

   }
   .serachBox{
     width: 100%;
     position: absolute;
     margin-top: 10px;
     display: flex;
     z-index: 99;
     justify-content: space-between;
     align-items: center;
     //z-index: 13;
     left:0;
     top: 45px;
     background-color: #ffffff;
     /deep/ .ivu-form-item{
       margin-bottom: 0;
     }
     .search-form {
       padding: 10px;
       background-color: #fff;
     }
     .imgSwipe{
       display: flex;
       justify-content: flex-start;
       align-items: center;
       //padding: 7px 12px;
       overflow-x: scroll;
       .swipe_item:last-child{
         padding-right: 0;
       }
       .swipe_item{
         display: flex;
         padding-right: 12px;
         flex-direction: column;
         align-items: center;
         justify-content: center;
         .text{
           font-size: 12px;
           font-weight: 400;
           margin-top: 8px;
           color: #035BEB;
         }
         .img_box{
           width: 56px;
           height: 48px;
           img{
             width: 100% ;
             height: 100% ;
           }
         }
       }
     }
     .serachInput{
       position: relative;
       padding: 5px;
       /deep/ .ivu-input-wrapper{
         .ivu-input{
           border: 1px solid #035BEB;
           .van-cell{
            ::v-deep .van-field__left-icon{
               display: flex;
               justify-content: center;
               align-items: center;
             }
           }
         }
       }
       .btn{
         position: absolute;
         top: 5px;
         right:5px;
         display: flex;
         justify-content: center;
         align-items: center;
         width: 64px;
         height: 32px;
         background: #035BEB;
         //border-radius: 20px;
         span{
           font-weight: 400;
           color: #FFFFFF;
           font-size: 14px;
         }
       }
     }
   }
   ::v-deep .van-tabs__line{
     font-size: 20px;
     display: none;
   }
   ::v-deep .van-tabs__wrap{
     height: 40px;
     position: fixed;
     top: 44px;
     z-index: 13;
     left: 0;
     width: 100%;
     .van-tabs__nav--line{padding: 0;}
     .van-tab--active{
       color: #035BEB !important;
     }
     .van-tab{
       color: #00142D;
       .van-tab__text{
         .van-badge__wrapper{
           padding: 10px 20px;
           font-size: 14px;
           font-weight: 500;
           .van-badge--fixed{transform: none; top: 2px;}
         }
       }
     }
   }
 }
}
